// banner
var $banner = $(".banner"),
    $pic = $banner.find(".pic ul li"),
    $tab = $banner.find(".tab ul li"),
    $btn = $banner.find(".btn div"),
    length = $pic.length,
    index = 0,
    clickTime = 0,
    timer1 = null,
    timer2 = null;

var $picUl = $pic.parent(),
    width = $pic.width();
$picUl.prepend($pic.last().clone(true, true));
$picUl.append($pic.first().clone(true, true));
$picUl.width((length + 10) * width).css("marginLeft", -width).parent().css("overflow", "hidden");
$pic = $picUl.children();
$pic.css({
    width: width,
    position: "static",
    float: 'left'
});
$tab.eq(0).addClass("on");


$tab.click(function () {
    var x = $(this).index();
    if (x !== index) {
        clearTimeout(timer1);
        timer1 = setTimeout(change, 10, x);
    }
});

//定时器
$banner.hover(function () {
    clearInterval(timer2);
}, auto());

function auto() {
    timer2 = setInterval(function () {
        var x = index;
        x++;
        change(x);
    }, 2000);
    return auto;
}

//变化函数
function change(i) {
    var moveIndex = i;

    i %= length;
    if (i < 0) i = length - 1;

    $tab.eq(index).removeClass("on");
    index = i;
    $picUl.stop().animate({
        marginLeft: -(moveIndex + 1) * width
    }, 500, function () {
        if (index === 0 || index === length - 1) {
            $(this).css("marginLeft", -(index + 1) * width);
        }
    });
    $tab.eq(index).addClass("on");
}


// win
$(".later").click(function(){
    $(".win").hide().delay(60000).fadeIn()
})

//more
$("#more").click(
    function name(params) {
        $(this).hide()
        $(".games").fadeIn();
    }
)
//





